.community-header {
  background-color: transparentize($brand-blue, 0.7);
  margin-bottom: $grid-basic * 2.5;
  padding-bottom: $grid-basic * 2;
  .sub-nav {
    margin: 0;
    padding: $grid-basic * 2 0 $grid-basic 0;
  }
  .breadcrumbs {
    vertical-align: middle;
    @media(max-width: $break-tablet-max) {
      white-space: normal;
    }
    li {
      color: $brand-black;
    }
    a {
      color: $brand-black;
    }
  }
  h2.community-header-title {
    font-size: 1.8rem;
    margin-top: 0;
    margin-bottom: $grid-basic;
    color: $brand-black;
    font-weight: bold;

    @media(max-width: $break-tablet-max) {
      font-size: 1.6rem;
    }
  }
  p.community-header-description {
    margin: 0;
    color: #666;
    font-size: 1rem;
  }
  .community-header-subscribe {
    margin-top: $grid-basic;
    .dropdown-toggle {
      @extend .btn-yellow;
      border:none;
      font-size: 0.9rem;
      .fa {
        margin-right: $grid-basic/2;
      }
      &:after {
        color: #FFF;
      }
    }
  }
  .topic-unsubscribe {
    @extend .btn-gray;
    border:none;
    font-size: 0.9rem;
  }
}
.topic-list,
.thread-list {
  margin-top: $grid-basic * 2;
  margin-bottom: $grid-basic * 4;
  thead {
    th {
      border-top: none;
      padding: $grid-basic/2 $grid-basic;
      color: $brand-black;
      @media(max-width: $break-tablet-max) {
        padding: $grid-basic/2;
      }
    }
    th:nth-child(2),
    th:nth-child(3) {
      text-align: right;
    }
  }
  tbody {
    td {
      padding: $grid-basic * 1.5 $grid-basic*2;
      @media(max-width: $break-tablet-max) {
        padding: $grid-basic $grid-basic/2;
      }
    }
  }
}

.topic-list {
  .topic-list-topicDescription {
    margin: $grid-basic/2 0 0 0;
    font-size: 1rem;
    &:empty {
      height: 1em;
    }
    @media(max-width: $break-tablet-max) {
      font-size: 0.9rem;
    }
  }
  .topic-list-topicName {
    font-weight: bold;
  }
  .topic-list-postsCount {
    font-size: 1.2rem;
    font-weight: bold;
    text-align: right;
    white-space: nowrap;
    .text-small {
      font-size: 0.8rem;
      font-weight: normal;
      display: inline-block;
      margin-left: 3px;
    }
    @media(max-width: $break-tablet-max) {
      font-size: 1rem;
    }
  }
  .topic-list-followerCount {
    white-space: nowrap;
    text-align: right;
    font-size: 0.8rem;
  }
}

.topic-header {
  @include clearfix();
  .btn-newPost {
    @extend .btn-blue;
    border:none;
    float: right;
    padding: 7px 30px;
    font-size: 0.9rem;
  }
}
.thread-list {
  .thread-list-metaInfo {
    font-size: 0.8rem;
  }
  .thread-list-threadName {
    @media(max-width: $break-tablet-max) {
      display: inline-block;
      margin-bottom: $grid-basic/2;
    }
  }
  .thread-list-commentCount,
  .thread-list-voteCount{
    white-space: nowrap;
    font-size: 1.1rem;
    .fa {
      font-size:1rem;
      margin-right:$grid-basic/2;
    }
    .text-small {
      margin-left: 3px;
      font-size: 0.8rem;
    }
    @media(max-width: $break-tablet-max) {
      font-size: 0.9rem;
    }
  }
}

.post-actions {
  @include clearfix;
  margin-bottom:$grid-basic;
  .post-subscribe,
  .post-unsubscribe {
    @extend .btn-yellow;
    border:none;
    float: right;
    font-size: 0.9rem;
    margin-right:$grid-basic;
    .fa {
      margin-right: $grid-basic/2;
    }
  }
  .post-to-community a {
    @extend .btn-blue;
    border:none;
    font-size: 0.9rem;
    float: right;
  }
}

article.post {
  background-color: $brand-gray;
  padding: $grid-basic*2.5;
  margin-bottom: $grid-basic * 2;

  @media(max-width: $break-tablet-max) {
    padding: $grid-basic*1.5;
  }

  h1 {
    margin: 0 0 $grid-basic 0;
    font-size: 1.2rem;
    font-weight: bold;
    color: $brand-black;
  }
  .post-info {
    font-size: 0.9rem;
    > * {
      vertical-align: top;
    }
    .post-avatar {
      min-width:50px;
      img {
        max-height: 35px;
        max-width: 35px;
        border-radius: 50%;
      }
    }
  }
  .post-body {
    p {
      margin: $grid-basic/2 0 $grid-basic 0;
      line-height: 1.3rem;
      font-size: 1rem;
    }
  }
}
.post-body-action {
  float: right;
  margin-bottom: 0;
}

.community-header .community-header-subscribe .topic-unsubscribe, .post-actions .post-unsubscribe,
.section-header .section-unsubscribe, .article .article-unsubscribe {
  background-color: #F0F0F0;
  color: #4A4A4A;
}

.community-header .community-header-subscribe .topic-unsubscribe:hover, .post-actions .post-unsubscribe:hover,
.section-header .section-unsubscribe:hover, .article .article-unsubscribe:hover {
  background-color: #e3e3e3;
}

.article .article-subscribe, .article .article-unsubscribe {
  border: none;
  float: right;
  font-size: 0.9rem;
  margin-right: 8px;
}
article .article-subscribe .fa {
  margin-right: $grid-basic / 3;
}